<template>
    <el-table border v-bind="table" v-autoHeight v-loading="loading">
        <slot name="default">
            <el-table-column v-if="serial !== undefined" align="center" min-width="100" :label="t('list.serial')"
                type="index" :index="serial"></el-table-column>

            <MyTableColumn v-for="col in columns" :props="col">
                <!-- 让外部能直接使用 MyTableColumn 组件中所有启用的插槽 -->
                <template v-for="slot in Object.keys($slots)" #[slot]="{ row, column, $index }">
                    <slot :name="slot" :row="row" :column="column" :$index="$index"></slot>
                </template>
            </MyTableColumn>
        </slot>
        <template #append>
            <slot name="append"></slot>
        </template>
        <template #empty>
            <slot name="empty"></slot>
        </template>
    </el-table>
</template>

<script setup lang="ts">
import type { MyTableType } from "./MyTable"
import MyTableColumn from "./MyTableColumn/Index.vue"
import useI18n from "@/hooks/useI18n";

const t = useI18n()

defineOptions({
    name: "MyTable"
})

defineProps<MyTableType>()

</script>

<style lang="scss"></style>